<template>
  <i class="counDown">已读:{{ time }}</i>
</template>

<script>
import { mapState, mapActions } from "vuex";
import { formerTime } from "../../utils/counDown";
import { getItem } from "../../utils/sessiton";
export default {
  data() {
    return {
      time: "00:00",
      t: null,
    };
  },
  computed: {
    ...mapState("discuss", ["arr", "Dianz"]),
  },
  methods: {
    ...mapActions("msbd", ["setSchedule"]),
  },
  mounted() {},
  beforeDestroy() {
    clearInterval(this.t);
  },
  watch: {
    arr: {
      handler(newVal) {
        if (newVal.time) {
          // let times = newVal.time * 60;
          let times = newVal.time;
          this.t = setInterval(() => {
            this.time = formerTime(--times);
            if (times <= 0) {
              this.time = "00:00";
              clearInterval(this.t);
              this.$toast(
                "已经阅读",
                3000,
                50,
                "iconxiangmufangan-baoyang-duigou"
              );
              this.setSchedule({ uid: getItem().id, bdids: newVal.id });
            }
          }, 1000);
        }
      },
      deep: true,
    },
  },
};
</script>

<style scoped>
i.counDown {
  font-size: 13px;
  color: #ccc;
}
</style>